<template>
  <view>
    <uni-forms ref="form" :rules="{}">
      <uni-forms-item label="姓名" name="">
        <uni-easyinput v-model="user.username" placeholder="请输入姓名" />
      </uni-forms-item>
      <uni-forms-item label="密码" name="">
        <uni-easyinput type="password" v-model="user.password" placeholder="请输入密码" />
      </uni-forms-item>
      <uni-forms-item label="年龄" name="">
        <slider @change="ageChange" min="0" max="100" show-value />
      </uni-forms-item>
      <uni-forms-item label="性别" name="">
        <radio-group name="" @change="sexChange">
          <label>
            <radio value="1" :checked="'1'===user.sex" /><text>男</text>
          </label>
          <label>
            <radio value="2" :checked="'2'===user.sex" /><text>女</text>
          </label>
        </radio-group>
      </uni-forms-item>
      <uni-forms-item label="爱好" name="">
        <checkbox-group name="" @change="hobbyChange">
          <label v-for="item,index in user.hobbies" style="margin-left: 20rpx; margin-right: 20rpx; ">
            <checkbox :value="item" /><text>{{item}}</text>
          </label>
        </checkbox-group>
      </uni-forms-item>
      <uni-forms-item label="介绍" name="">
        <uni-easyinput v-model="user.introduce" type="textarea" autoHeight placeholder="请输入个性介绍" />
      </uni-forms-item>
      <uni-forms-item label="日期" name="">
        <picker mode="date" @change="dateChange">
          <view>{{user.datetimesingle}}</view>
        </picker>
      </uni-forms-item>
      <uni-forms-item label="城市" name="">

        <uni-combox :candidates="user.cities" placeholder="请选择城市" v-model="user.city"></uni-combox>
      </uni-forms-item>
      <uni-forms-item label="是否接受推荐" name="">
        <switch :checked="user.adviceAccept" @change="adviceChange" />
      </uni-forms-item>
      <uni-forms-item label="" name="">
        <button type="primary" @click="register">注册</button>
      </uni-forms-item>
    </uni-forms>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        user: {
          username: '',
          age: 0,
          password: '',
          repassword: '',
          sex: 2,
          hobbies: ['足球', '篮球', '排球', '网球', '羽毛球', '乒乓球'],
          hobby: [],
          introduce: '',
          datetimesingle: '2023-09-09',
          city: '',
          cities: ['北京', '上海', '长沙', '深圳', '广州'],
          adviceAccept: true
        }
      }
    },
    methods: {
      sexChange(e) {
        this.user.sex = e.detail.value
      },
      adviceChange(e) {
        this.user.adviceAccept = e.detail.value
      },
      hobbyChange(e) {
        this.user.hobby = e.detail.value
      },
      ageChange(e) {
        this.user.age = e.detail.value
      },
      dateChange(e) {
        this.user.datetimesingle = e.detail.value
      },
      register(e) {
        if (this.user.username && this.user.password !== ''
        ) {
          uni.request({
            url: 'http://localhost:8090/foodapp/user/register',
            method: 'post',
            data: this.user,
            success: res => {
              console.log(res);
              if (res.data.success === true) {
                uni.showToast({
                  title: this.user.username + '注册成功',
                  icon: 'success',
                  duration:2000,
                  complete() {
                    setTimeout(function(){
                      uni.navigateTo({
                        url:'/pages/my/login'
                      })
                     
                    } ,2000)
                  }
                 
                });
              } else {
                uni.showToast({
                  title: '注册失败',
                  icon: 'error'
                });
              }
            },
            fail: (err) => {
              uni.showToast({
                title: '网络错误',
                icon: 'error'
              });
            },
            complete: () => {}
          });
        } else {
          uni.showToast({
            title: '用户名或密码错误',
            icon: 'error'
          });
        }
      }

    }
  }
</script>

<style>

</style>